<template>
  <div>
    <el-table
        :data="tableData"
        :span-method="objectSpanMethod"
        border
        style="width: 100%; margin-top: 20px">
      <el-table-column
          prop="location"
          label="省"
          width="180">
      </el-table-column>
      <el-table-column
          prop="stname"
          label="市">
      </el-table-column>
      <el-table-column
          prop="maxtemp"
          label="最高温">
      </el-table-column>
      <el-table-column
          prop="mintemp"
          label="最低温">
      </el-table-column>
      <el-table-column
          prop="date"
          label="日期">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      allDate: [],
      index: 0
    };
  },
  created() {
    this.get();
    setInterval(this.setTable, 5000);
  },
  methods: {
    get() {
      this.axios.get("/weather").then(res => {
            console.log(res.data)
            let d = res.data
            let date = ''
            let data = []
            this.allDate = []
            for (let i = 0; i < d.length; i++) {
              if (date !== d[i].date || i == d.length - 1) {
                if (i == d.length - 1) {
                  data.push(d[i])
                }
                if (date !== '') {
                  this.allDate.push(data)
                }
                data = []
                date = d[i].date
              }
              data.push(d[i])
            }
            this.setTable();
          }
      )
    },
    setTable() {
      if (this.index + 1 > this.allDate.length) {
        this.index = 0
      }

      // console.log(this.allDate)
      // console.log(this.allDate.get(key))
      let d = this.allDate[this.index]
      d.forEach(v => {
        v.rowspan = 1;
        v.rowspans = 1;
      });
      for (let i = 0; i < d.length; i++) {
        for (let j = i + 1; j < d.length; j++) {
          //此处可根据相同字段进行合并，此处是根据的id
          if (d[i].location === d[j].location) {
            d[i].rowspans++;
            d[j].rowspans--;
          }
        }
        // 这里跳过已经重复的数据
        i = i + d[i].rowspans - 1;
      }
      console.log(1, d)
      this.tableData = d;

      this.index++
    },
    objectSpanMethod({row, column, rowIndex, columnIndex}) {
      if (columnIndex === 0) {
        return {
          rowspan: row.rowspans,
          colspan: 1
        };
      }
    }
  }
};
</script>
